.box-userinfo {
	margin-left: 20px;
	margin-top: 20px;
	float: left;
	width: 28%;
	text-align: center;
	box-shadow: 0px 0px 2px 2px lightgray;
	border-radius: 2px;
}

.box-userinfo h2 {
	text-align: left;
	font-size: 16px;
	margin-top: 15px;
	margin-bottom: 0px;
	text-indent: 15px;
	padding-bottom: 7px;
	border-bottom: 1px solid lightgray;
}

.box-userinfo img {
	border-radius: 50%;
	border: 1px solid black;
	width: 130px;
	height: 130px;
	margin: 20px 0;
}

.box-userinfo ul {
	padding: 0 20px;
	list-style-type: none;
	text-align: left;
	padding-bottom: 20px;
}

.box-userinfo ul li {
	height: 50px;
	line-height: 50px;
	font-size: 14px;
	border-top: .5px solid lightgray;
	border-bottom: .5px solid lightgray;
}

.box-userinfo ul li span:last-child {
	float: right;
}

.box-userinfo-right {
	margin-top: 20px;
	list-style: none;
	/* width: 980px; */
	/* border: 1px solid black; */
	float: left;
	margin-left: 20px;
	padding: 0;
	box-shadow: 0 0 2px 2px lightgray;
	
}

.box-userinfo-right h2 {
	text-align: left;
	font-size: 16px;
	margin-top: 15px;
	margin-bottom: 0px;
	text-indent: 15px;
	padding-bottom: 7px;
	border-bottom: 1px solid lightgray;
}

.box-userinfo-right-form {
	/* border: 1px solid black; */
	padding: 0 20px;
	padding-bottom: 40px;
}

.box-userinfo-right-form::after {
	content: "";
	clear: both;
	display: block;
}

.box-userinfo-right h3 {
	padding: 10px;
	font-size: 14px;
	text-align: left;
	border-bottom: 1px solid lightgray;
	;
}
.box-userinfo-right h3 span{
	margin-right: 10px;
	padding: 10px;
	background: linear-gradient(to right, #1664da, #1664da) no-repeat left bottom;
	background-size: 0% 3px;
	transition: background-size 500ms;
}
.box-userinfo-right h3 span:first-of-type {
	color: #1664da;
	background: linear-gradient(to right, #1664da, #1664da) no-repeat left bottom;
	background-size: 100% 3px;
	transition: background-size 600ms;
}
/* .box-userinfo-right h3 span:hover{
	color: #1664da;
	background-size: 100% 3px;
} */
.box-userinfo-right-form form li{
	height: 50px;
	line-height: 50px;
}
.box-userinfo-right-form form li div label{
	text-align: right;
	margin-top: -10px;
}
.box-userinfo-right-form form li div label span{
	color: red;
}
.box-userinfo-right-form form li div .radio-inline{
	height: 20px;
	line-height: 20px;
}
.box-userinfo-right-form form li div .radio-inline:first-child{
	margin-top: -20px;
}
.box-userinfo-right-form form li div .radio-inline:last-child{
	margin-top: -20px;
}
.box-userinfo-right-btn-save,
.box-userinfo-right-btn-close{
	border: 0;
	width: 80px;
	line-height: 30px;
	font-weight: bolder;
	border-radius: 5px;
	font-size: 14px;
	font-weight: 100px;
}
.box-userinfo-right-btn-save{
	margin-left: 135px;
	background-color: #ecf5ff;
	color: #409eff;
	border: 1px solid #a0cfff;

}

.box-userinfo-right-btn-save:hover{
	margin-left: 135px;
	background-color: #409eff;
	color: #fff;
	border: 1px solid #409eff;

}

.box-userinfo-right-btn-close{
	background-color: #fef0f0;
	color: #f56c6c;
	border: 1px solid #fab6b6;
	margin-left: 10px;
}

.box-userinfo-right-btn-close:hover{
	background-color: #f56c6c;
	color: #fff;
	border: 1px solid #f56c6c;
	margin-left: 10px;
}

.fa{
	font-size: 16px;
	width: 16px;
	margin-right: 5px;
}
